<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<script type="text/javascript">if(parent.emulator)parent.emulator.begin(window);</script>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title>Opera SVG Viewer </title>
    <link href="css/jstree.default.css" rel="stylesheet"/>
    <link href="css/OSV.css" rel="stylesheet"/>
</head>
<body class="clearfix de bug">

<div id="allButChrome">
  <div id="content">
  		<ul id="menu" class="clearfix">
        	<li id="menu-file">
            	<a>File</a>
            	<ul>
                	<li><a href="#" id="menu_open_folder" class="cmd-openFolder icon-open-folder"><span class="menu-txt">Open Directory...</span> <span class="shortcut">Ctrl+O</span></a></li>
                	<li class="sep"/>
					<li><a href="#" class="cmd-fixCurFile">Fix current file</a></li>
					<li><a href="#" class="cmd-fixFiles">Fix all files in current folder...</a></li>
                	<li class="sep"/>
					<li><a href="#" class="cmd-delFile">Delete current file...</a></li>
                	<li class="sep"/>
                    <li><a href="#" id="showSamplesDir" class="cmd-show-samples-dir menuitem-checkbox"><span class="menu-txt">Show SVG Samples Folder</span></a></li>
                	<li class="sep"/>
					<!--li><a class="icon-settings cmd-settings" href="#">Settings...</a></li>
                	<li class="sep"/-->
                	<li><a href="#" onClick="javascript:window.close()"><span class="menu-txt">Exit</span><span class="shortcut">Alt+F4</span></a></li>
                </ul>
            </li>
        	<li id="menu-view">
            	<a>View</a>
            	<ul>
                	<li><a class="icon-image">Thumbnail Size</a>
                        <ul>
                            <li><a href="#" class="setThumbs" data-size="0">No Preview</a></li>
                            <li><a href="#" class="setThumbs" data-size="32">32x32</a></li>
                            <li><a href="#" class="setThumbs" data-size="64">64x64</a></li>
                            <li><a href="#" class="setThumbs" data-size="100">100x100</a></li>
                            <li><a href="#" class="setThumbs" data-size="200">200x200</a></li>
                        </ul>
                    </li>
                	<li class="sep"/>
                    <li><a href="#" id="fitViewport" class="cmd-fit-viewport menuitem-checkbox"><span class="menu-txt">Fit Image to Viewing Area</span></a></li>
                    <li><a href="#" id="fitBig" class="cmd-fit-big menuitem-checkbox"><span class="menu-txt">Only Fit Large Images</span></a></li>
                    <li><a href="#" id="zoomIn" class="cmd-zoom-in"><span class="menu-txt">Zoom In</span><span class="shortcut">]</span></a></li>
                    <li><a href="#" id="zoomOut" class="cmd-zoom-out"><span class="menu-txt">Zoom Out</span><span class="shortcut">[</span></a></li>
                    <li><a href="#" id="resetZoom" class="cmd-reset-zoom"><span class="menu-txt">Reset Zoom and Position</span><span class="shortcut">0</span></a></li>
                    <li><a href="#" id="toggleZoomNPan" class="cmd-toggle-zoomnpan menuitem-checkbox"><span class="menu-txt">Disable Zoom and Pan</span><span class="shortcut">Esc</span></a></li>

                	<li class="sep"/>
                    <li><a href="#" id="toggleGrid" class="cmd-toggle-grid menuitem-checkbox"><span class="menu-txt">Transparency Grid</span><span class="shortcut">G</span></a></li>
                    <li><a href="#" id="toggleWireframe" class="cmd-toggle-wireframe menuitem-checkbox"><span class="menu-txt">Wireframe mode</span><span class="shortcut">W</span></a></li>
                	<li class="sep"/>
                    <li><a href="#" id="includeBitmap" class="cmd-show-bitmap menuitem-checkbox"><span class="menu-txt">Show bitmap images</span></a></li>
                </ul>
            </li>
        	<li id="menu-help">
            	<a>Help</a>
            	<ul>
                	<li><a href="#" class="cmd-show-hotkeys-list">Hotkeys...</a></li>
                	<li><a href="#" class="cmd-about">About...</a></li>
              </ul>
            </li>
        </ul><!--/#menu-->
    
        <section id="toolbar" class="clearfix">
            <label for="browseFolder" class="button">
            	    <button class="cmd-openFolder" id="browseFolder" title="Open a directory" tabindex="-1">
            	        <img src="img/icons/32_OSV_icon.png" alt="Select a folder with SVG files" />
            	    </button>
            	</label>
            	
            	<label for="qty" class="button" title="Pictures per page ">
            	    <input type="text" list="pixPerPage" id="qty" tabindex="-1"/>
            	    <datalist id="qtySel">
            	        <select id="pixPerPage">
            	         <option value="10"/>
            	         <option value="20"/>
            	         <option value="40"/>
            	        </select>  
            	    </datalist>
            	</label>
            	<div id="pager" class="button"></div>
				<div id="dynButtons"></div>
				<!--label for="btnConfig" class="button">
					<button id="btnConfig" title="Options" class="cmd-settings" tabindex="-1"><img src="img/config.png" alt=""/></button>
				</label-->
        </section><!--/#toolbar -->

        <div id="gallery">
            <section id="outerWestPane" >
            </section>
				<!--ul class="paneToolbar ui-layout-ignore"><li><a href="#thumbsPane">Thumbs</a></li><li><a href="#folders">Folders</a></li></ul-->
            <div id="folders">
                <div class="innerScroller" >
                    <div id="recentDirs"><ul></ul></div>
                </div>
            </div>

            <div id="thumbsPane">
                <div class="innerScroller" ></div>
            </div>
			
            <section id="singlePic">
                <div id="bigPic" ><span/></div>
            </section>
        </div><!-- /#gallery-->
    </div><!-- #content -->
    
    
    <!--div id="prefsPage" class="modal-page">
        <form id="config">
            <fieldset>
        		<p><span class="icon icon-info"/> All changes are saved automatically</p>
            </fieldset>
            <fieldset>
                <legend>Exclude files</legend>
    
                <input id="includeRaster" type="checkbox" class="cmd-show-bitmap"/>
                <label for="includeRaster">Show raster format images (jpeg, png, etc).</label>
                <p>The change will take effect next time you choose a directory.</p>
    
            </fieldset>
        </form>
    </div--><!-- /#prefsPage-->
    <div id="hotkeysList" class="cmd-show-hotkeys-list modal-page">
        <h2>Hotkeys in Opera SVG Viewer</h2>
        <ul class="frmtd striped">
            <li><kbd>[</kbd> Zoom out</li>
            <li><kbd>]</kbd> Zoom in</li>
            <li><kbd>0</kbd> Reset zoom and position</li>
            <li><kbd>Esc</kbd> Toggle zoom and pan for current image</li>
            <li><kbd>PgDn</kbd> Go to next page of thumbs</li>
            <li><kbd>PgUp</kbd> Go to previous page page of thumbs</li>
            <li><kbd>Home</kbd> Go to the first page of thumbs</li>
            <li><kbd>End</kbd> Go to the last page of thumbs</li>
            <li><kbd>Space</kbd> Open next image</li>
            <li><kbd>Backspace</kbd> Open previous image</li>
            <li><kbd>W</kbd> Toggle wireframe mode</li>
            <li><kbd>G</kbd> Toggle transparency grid</li>
        </ul>
        
    </div>
</div><!--/#allButChrome-->
<div id="statusBar" class="chrome">
    <span id="c-t" title="Currently displayed / total files"/>
    <span id="cf" title="File name"/>
    <span id="fsz" title="File size"/>
    <span id="wh" title="Width/Height"/>
    <span id="vb" title="ViewBox: x y width height"/>
    <span id="curZoom" title="Zoom factor"/>
    <span id="etc"/>
</div>

	<input type="text" id="debugger" placeholder="Enter a JS expression and see console" tabindex="-1"/>
	
	<script src="scripts/jquery-1.6.1.min.js"></script>
	<script src="scripts/tools.js"></script>
	<script src="scripts/debug.js"></script>
	<script src="scripts/old/ui.core.js"></script>
	<script src="scripts/old/ui.draggable.js"></script>
	<script src="scripts/old/ui.tabs.js"></script>
 <!--script src="scripts/jquery.ui.core.min.js" ></script>
	<script src="scripts/jquery.ui.draggable.min.js" ></script>
	<script src="scripts/jquery.ui.tabs.min.js" ></script-->
	<script src="scripts/jquery.layout.1.3.min.RC-29.14.js"></script>
	<script src="scripts/jquery.superfish.js"></script>
	<script src="scripts/jquery.pagination.js"></script>
	<script src="scripts/jquery.hotkeys.js"></script>
	<script src="scripts/jquery.simplemodal.js"></script>
	<script src="scripts/jquery.jstree.js"></script>
	<script src="scripts/ZoomNPan.js"></script>
	<script src="scripts/OSV.js"></script>
</body>
</html>

